<!DOCTYPE html>

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>

<html>
<head>
<link href="<c:url value="/bootstrap/css/bootstrap.min.css"/>" rel="stylesheet">	
<link rel="stylesheet" media="all" type="text/css"
	href="<c:url value="/resources/css/styles.css" />">
	
	<script  type="text/javascript"
	src='<c:url value="/resources/js/jquery-1.11.1.min.js" />'></script>
	<script src="<c:url value="/bootstrap/js/bootstrap.min.js"/>"></script>
<meta charset="utf-8">
<title>Travel Journal</title>
</head>
<body>
	<div class="header">
		<div class="topnav">
			<ul id="nav">
				<li><a href="/TravelJournal/">Log Out</a></li>
			</ul>
		</div>
	</div>


	<div id="content">
		<div id="sidebar">
			<ul>
				<li><a href="/TravelJournal/welcome">Home</a></li>
				<li><a href="/TravelJournal/records/myrecords">My Records</a></li>
				<li><a href="#">Add Record</a></li>
				<li><a href="/TravelJournal/records/map">My Travel Map</a></li>
			</ul>
		</div>
			<div id="main-content">
				
				<h2>Add Image</h2>
				
				<c:if test="${not empty error}">
					<div class="error">${error}</div>
				</c:if>

<%-- 				<form method="POST" action="uploadFile" enctype="multipart/form-data"> --%>
<!--         File to upload: <input type="file" name="file"><br /> -->
<!--         Name: <input type="text" name="name"><br /> <br /> -->
<!--         <input type="submit" value="Upload"> Press here to upload the file! -->
<%--     </form> --%>
				<form:form method="post" commandName="travelImage" enctype="multipart/form-data" 
					action="/TravelJournal/images/uploadFile/${travelImage.recordId}?${_csrf.parameterName}=${_csrf.token}" role="form">
					<div class="form-group">
						<form:label path="title">Title:</form:label>
						
						<form:input id="title" path="title" class="form-control"/>
					</div>
					<div class="form-group">
						<form:label path="description">Description:</form:label>
						<form:textarea id="description" path="description" class="form-control"/>
					</div>
					<div class="form-group">
						<form:input path="file" type="file" accept="image/*" />
						<form:hidden path="recordId"/>
					</div>
					<input id='submitButton' type="submit" value="Save" class="btn" />
				</form:form>
			</div>
		


	</div>
	
	<script type="text/javascript">

</script>
	
</body>
</html>
